let inputs = document.querySelectorAll(".api-textbox input")
inputs.forEach(function(v){
    v.addEventListener("input",function(){
        if(this.nextElementSibling){
            //console.log(this.nextElementSibling.firstElementChild);
            // this.nextElementSibling.style.display="block"
            this.nextElementSibling.firstElementChild.style.display="block"
        }
    })
})
console.log(inputs)
let imgs = document.querySelectorAll(" .error img")
imgs.forEach(function(v){
    v.addEventListener("click",function(){
        this.parentNode.previousElementSibling .value = ""
    
        this.style.display = "none"
    })
})
console.log(inputs)
let checkbox = document.querySelector(".agree input")
let registerBtn = document.querySelector(".reg-btn")
checkbox.addEventListener("click",function(){
    if(checkbox.checked){
        registerBtn.style.backgroundColor = "#00bddf"
        registerBtn.style.color = "#fff"
    }else {
        registerBtn.style.backgroundColor = "#e0e0e0"
        registerBtn.style.color = "#333"
    }
})

let tel = document.querySelector(".tel")
tel.addEventListener("blur", function () {
    if (! /^1[3-9][0-9]{9}$/.test(this.value)) {
        this.nextElementSibling.firstElementChild.nextElementSibling.nextElementSibling.style.display = "block"
        this.nextElementSibling.firstElementChild.nextElementSibling.style.display="block"

    } else {
        this.nextElementSibling.firstElementChild.nextElementSibling.nextElementSibling.style.display = "none"
        this.nextElementSibling.firstElementChild.nextElementSibling.style.display="none"
    }

})
let username = document.querySelector(".username ")
username.addEventListener("blur", function () {
    if (! /^[A-Za-z0-9_]{6,12}$/.test(this.value)) {
        this.nextElementSibling.firstElementChild.nextElementSibling.nextElementSibling.style.display = "block"
        this.nextElementSibling.firstElementChild.nextElementSibling.style.display="block"
    } else {
        this.nextElementSibling.firstElementChild.nextElementSibling.nextElementSibling.style.display = "none"
        this.nextElementSibling.firstElementChild.nextElementSibling.style.display="none"
    }

})

let code = document.querySelector(".code")
code.addEventListener("blur", function () {
    if (! /^[0-9]{4}$/.test(this.value)) {
        this.nextElementSibling.firstElementChild.nextElementSibling.nextElementSibling.style.display = "block"
        this.nextElementSibling.firstElementChild.nextElementSibling.style.display="block"
    } else {
        this.nextElementSibling.firstElementChild.nextElementSibling.nextElementSibling.style.display = "none"
        this.nextElementSibling.firstElementChild.nextElementSibling.style.display="none"
    }

})

let password = document.querySelector(".password")
password.addEventListener("blur", function () {
    if (! /^[A-Za-z0-9_]{6,12}$/.test(this.value)) {
        this.nextElementSibling.firstElementChild.nextElementSibling.nextElementSibling.style.display = "block"
        this.nextElementSibling.firstElementChild.nextElementSibling.style.display="block"
    } else {
        this.nextElementSibling.firstElementChild.nextElementSibling.nextElementSibling.style.display = "none"
        this.nextElementSibling.firstElementChild.nextElementSibling.style.display="none"
    }

})
// let username = document.querySelector(".username p img")
// let usernameInput = document.querySelector(".username .reg-input").valve=''
// username.addEventListener("click", function(){
 
// // usernameInput.valve= ""
// // this.previousElementSibling.value = ""
// // this.style.display = "none"

// })
// console.log(username)
// console.log(usernameInput)
// previousSibling
// previousElementSibling